<template>
  <el-select v-model="doctor" filterable @change="onChange">
    <el-option
      v-for="(item, index) in doctorList"
      :key="`doctor_${index}`"
      :value="item.id"
      :label="item.doctorName"
    ></el-option>
  </el-select>
</template>
<script>
import { GET_DOCTOR_LIST } from "@/http/interface";
export default {
  name: "DoctorSelect",
  props: {
    value: {
      type: [String, Number],
      default: "",
    },
  },
  watch: {
    value: {
      handler: function (n) {
        this.doctor = n;
      },
      immediate: true,
    },
  },
  data() {
    return {
      doctor: "",
      doctorList: [],
    };
  },
  created() {
    this.getList();
  },
  methods: {
    // 获取医生列表
    getList() {
      let params = {};
      params.current = 1;
      params.size = 10000;
      GET_DOCTOR_LIST(params).then((res) => {
        let _obj = res.data || {};
        this.doctorList = _obj.records || [];
      });
    },

    // 监听下拉框选择
    onChange(e) {
      let _list = this.doctorList || [];
      let m = _list.find((k) => k.id == e);
      this.$emit("input", e);
      this.$emit("change", m ? m.doctorName : "");
    },
  },
};
</script>
<style lang="scss" scoped>
</style>